
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <link rel="stylesheet" href="/static/component/pear/css/pear.css" />
</head>
<body class="pear-container">
<div class="layui-card">
  <div class="layui-card-body">
    <table id="dataTable" lay-filter="dataTable"></table>
  </div>
</div>

<script type="text/html" id="options">
  <button class="pear-btn pear-btn-primary pear-btn-sm" lay-event="edit"><i class="layui-icon layui-icon-edit"></i></button>
  <button class="pear-btn pear-btn-danger pear-btn-sm" lay-event="remove"><i class="layui-icon layui-icon-delete"></i></button>
</script>

<script type="text/html" id="toolbar">
  <button class="pear-btn pear-btn-success pear-btn-md" lay-event="add">
    <i class="layui-icon layui-icon-add-1"></i>
    新增友链
  </button>
</script>

<script src="/static/component/layui/layui.js"></script>
<script src="/static/component/pear/pear.js"></script>
<script>
  layui.use(['table', 'form', 'jquery','common'], function() {
    let table = layui.table;
    let form = layui.form;
    let $ = layui.jquery;
    let common = layui.common;

    let MODULE_PATH = "{$Request.root}/admin.links/";

    let cols = [
      [{
        field: 'link_id',
        title: 'ID',
        unresize: true,
        align: 'center',
        width: 80
      },{
        field: 'site_name',
        title: '名称',
        unresize: true,
        align: 'center'
      },{
        field: 'web_url',
        title: '网址',
        unresize: true,
        align: 'center'
      }, {
        field: 'sort',
        title: '排序',
        unresize: true,
        align: 'center',
      },
        {
          field: 'create_time',
          title: '创建时间',
          align: 'center',
          unresize: true,
        },
        {
          title: '操作',
          toolbar: '#options',
          unresize: true,
          align: 'center',
          width: 180
        }
      ]
    ]

    table.render({
      elem: '#dataTable',
      url: MODULE_PATH + 'index',
      page: true,
      cols: cols,
      cellMinWidth: 100,
      skin: 'line',
      toolbar: '#toolbar',
      defaultToolbar: [{
        title: '刷新',
        layEvent: 'refresh',
        icon: 'layui-icon-refresh',
      }, 'filter', 'print', 'exports']
    });

    table.on('tool(dataTable)', function(obj) {
      if (obj.event === 'remove') {
        window.remove(obj);
      } else if (obj.event === 'edit') {
        window.edit(obj);
      }
    });

    table.on('toolbar(dataTable)', function(obj) {
      if ((obj.event === 'add') ) {
        window.add();
      } else if (obj.event === 'refresh') {
        window.refresh();
      }
    });

    function screen() {
      if (typeof width !== 'number' || width === 0) {
        width = $(window).width() * 0.8;
      }
      if (typeof height !== 'number' || height === 0) {
        height = $(window).height() - 20;
      }
      return [width + 'px', height + 'px'];
    }

    window.add = function() {
      layer.open({
        type: 2,
        maxmin: true,
        title: '新增友链',
        shade: 0.1,
        area: screen(),
        content: MODULE_PATH + 'add'
      });
    }

    window.edit = function(obj) {
      layer.open({
        type: 2,
        maxmin: true,
        title: '编辑友链',
        shade: 0.1,
        area: screen(),
        content: MODULE_PATH + 'edit/id/'+obj.data['link_id']
      });
    }

    window.remove = function(obj) {
      layer.confirm('确定要删除友链', {
        icon: 3,
        title: '提示'
      }, function(index) {
        layer.close(index);
        let loading = layer.load();
        $.ajax({
          url:MODULE_PATH + 'del',
          data:{id:obj.data['link_id']},
          dataType: 'json',
          type: 'POST',
          success: function(res) {
            layer.close(loading);
            //判断有没有权限
            if(res && res.code==999){
              layer.msg(res.msg, {
                icon: 5,
                time: 2000,
              })
              return false;
            }else if (res.code == 0) {
              layer.msg(res.msg, {
                icon: 1,
                time: 1000
              }, function() {
                obj.del();
              });
            } else {
              layer.msg(res.msg, {
                icon: 2,
                time: 1000
              });
            }
          }
        })
      });
    }

    window.refresh = function(param) {
      table.reload('dataTable');
    }
  })
</script>
</body>
</html>
